<template>
  <div class="wrapper">
    <div v-if="$store.state.showTip" class="show-tip">{{showContent}}</div>
    <div class="main">
      <div class="header">
        <h3>创作：节气养生</h3>
      </div>
      <div class="">
        <div class="input-body">
          <div class="item">
            <label>标题</label><input v-model="hptitle" type="text"/>
          </div>
          <div class="item-text">
            <label>内容</label>
            <textarea v-model="hpcontent" class="textarea-class" type="text"></textarea>
          </div>
        </div>
      </div>
      <div class="button-class">
        <div class="search-button button-radius position-button" @click="saveHealthPreservation()"><a
          href="javascript:void(0)">保存</a></div>
        <div class="search-button button-radius position-button" @click="postHealthPreservation()"><a
          href="javascript:void(0)">提交</a></div>
      </div>


    </div>


  </div>
</template>

<script>
  import axios from 'axios'


  export default {
    name: "AddHealthPreservation",

    data() {
      return {
        hptitle: '',
        hpcontent: '',
        // showTip: false,
        showContent: ""
      }
    },
    created() {
      if (this.$store.state.record != null) {
        this.hptitle = this.$store.state.record.hotspotTitle
        this.hpcontent = this.$store.state.record.hotspotContent
      }

    },
    methods: {

      saveHealthPreservation: function () {
        if (this.$store.state.record != null) {
          //保存更改的文章
          let data = {
            "hotspotTitle": this.hptitle,
            "hotspotContent": this.hpcontent,
            "itemid": this.$store.state.record.itemid,
            "itemcode": this.$store.state.record.itemcode,
            "hotspotSource": this.$store.state.record.hotspotSource,
            "hotspotAuthor": this.$store.state.record.hotspotAuthor,
            "dataStatus": this.$store.state.record.dataStatus,
            "dataType": this.$store.state.record.dataType,
            "userCode": this.$store.state.record.userCode,
            "creater": this.$store.state.record.creater,
            "itemcreateat": this.$store.state.record.itemcreateat,
            "updater": new Date(),
            "itemupdateat": this.$store.state.record.itemupdateat
          };
          axios.post(`http://localhost:8071/updateTbNatmehaHotspotHealthPreservation`, data)
            .then(res => {
              console.log('res=>', res);
              if (res.data.code == 200) {
                this.showContent = res.data.msg;
                this.$store.commit("setShowTip")
                let that = this;
                setTimeout(function () {
                  that.$router.push({path: "/HealthPreservation"})
                }, 1700);
              }
            })
        } else {
          //创建新的文章
          // 8表示上架，7表示待审核，6表示保存（草稿）
          let data = {"hotspotTitle": this.hptitle, "hotspotContent": this.hpcontent, "dataStatus": "6"};
          axios.post(`http://localhost:8071/insertTbNatmehaHotspotHealthPreservation`, data)
            .then(res => {
              console.log('res=>', res);
              if (res.data.code == 200) {
                this.showContent = res.data.msg;
                this.$store.commit("setShowTip")
                let that = this;
                setTimeout(function () {
                  that.$router.push({path: "/HealthPreservation"})
                }, 1700);
              }
            })
        }
      },

      postHealthPreservation: function () {

        if (this.$store.state.record != null) {
          //保存更改的文章
          let data = {
            "hotspotTitle": this.hptitle,
            "hotspotContent": this.hpcontent,
            "itemid": this.$store.state.record.itemid,
            "itemcode": this.$store.state.record.itemcode,
            "hotspotSource": this.$store.state.record.hotspotSource,
            "hotspotAuthor": this.$store.state.record.hotspotAuthor,
            "dataStatus": 7,
            "dataType": this.$store.state.record.dataType,
            "userCode": this.$store.state.record.userCode,
            "creater": this.$store.state.record.creater,
            "itemcreateat": this.$store.state.record.itemcreateat,
            "updater": new Date(),
            "itemupdateat": this.$store.state.record.itemupdateat
          };
          axios.post(`http://localhost:8071/updateTbNatmehaHotspotHealthPreservation`, data)
            .then(res => {
              console.log('res=>', res);
              if (res.data.code == 200) {
                this.showContent = res.data.msg;
                this.$store.commit("setShowTip")
                let that = this;
                setTimeout(function () {
                  that.$router.push({path: "/HealthPreservation"})
                }, 1700);
              }
            })
        } else {
          //创建新的文章
          // 8表示上架，7表示待审核，6表示保存（草稿）
          let data = {"hotspotTitle": this.hptitle, "hotspotContent": this.hpcontent, "dataStatus": "7"};
          axios.post(`http://localhost:8071/insertTbNatmehaHotspotHealthPreservation`, data)
            .then(res => {
              console.log('res=>', res);
              if (res.data.code == 200) {
                this.showContent = res.data.msg;
                this.$store.commit("setShowTip")
                let that = this;
                setTimeout(function () {
                  that.$router.push({path: "/HealthPreservation"})
                }, 1700);
              }
            })
        }



      }

    }


  }
</script>

<style scoped>
  * {
    margin: 0;
    padding: 0;
  }

  .wrapper {

    padding: auto;

  }

  .main {
    margin: auto;
    width: 80%;
  }

  .header {
    top:-7px;
    position: absolute;
    line-height: 70px;
    font-size: 20px;
    width: 1200px;
    height: 70px;
    background-color: #775637;
    color: white;
  }

  .textarea-class {
    height: 450px;
    width: 670px;
  }

  .input-body {
    margin: auto;
    position: relative;

  }

  .button-class {
    position: absolute;
    left: 510px;
    top: 610px;
  }

  .button-class > div:first-child {

  }

  .button-class > div:last-child {
    top: -1px;
    position: absolute;
    left: 200px;
  }

  .item > label {
    position: absolute;
    display: block;
    left: 210px;
    width: 80px;
    margin-top: 10px;
    background-color: #775637;
    text-align: right;
    padding: 10px 10px 10px 0;
    color: white;
  }

  .item > input {
    position: absolute;
    margin-top: 10px;
    left: 310px;
    width: 660px;
    height: 38px;
    line-height: 1.3;
    border-width: 1px;
    border-style: solid;
    background-color: #fff;
    color: rgba(0, 0, 0, .85);
    border-radius: 2px;
    border-color: #666666;
    outline: none;
    display: block;
    padding-left: 10px;
  }

  .item-text > label {
    position: absolute;
    display: block;
    left: 210px;
    width: 80px;
    margin-top: 70px;
    background-color: #775637;
    text-align: right;
    padding: 10px 10px 10px 0;
    color: white;
  }

  .item-text > textarea {

    position: absolute;
    margin-top: 70px;
    left: 310px;
    outline: none;
  }

  .search-button {
    text-align: center;
    line-height: 30px;
    background-color: #D60000;
    height: 30px;
    width: 130px;
    padding: 0 15px 0 15px;
    color: white;
  }

  .search-button > a {
    text-decoration: none;
    color: white;
    display: block;
    font-size: 10px;
  }

  .button-radius {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
  }

  .show-tip {
    position: fixed;
    top: 50px;
    left: 50%;
    z-index: 9999;
    height: 35px;
    padding: 0 20px;
    line-height: 35px;
    background-color: rgba(65, 65, 65, 0.7);
    color: white;

  }
</style>
